import React, { createContext, Reducer, useReducer, ReactElement } from 'react';

import { AppState, Action, ProviderData, Context } from './types';
import actions from './actions';

const initialState: AppState = {};

const reducer = (state: AppState, action: Action): AppState => {
  switch (action.type) {
    default:
      return state;
  }
};

export const AppStore = createContext<Context>({ appState: initialState });

const Provider = (props: ProviderData): ReactElement => {
  const [appState, appDispatch] = useReducer<Reducer<AppState, Action>>(
    reducer,
    initialState
  );
  const { children } = props;

  actions(appDispatch);

  return (
    <AppStore.Provider value={{ appState, appDispatch }} {...props}>
      {children}
    </AppStore.Provider>
  );
};

export default Provider;
